<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<!DOCTYPE html>
<html class="x-admin-sm">
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
	request.setAttribute("basePath", basePath);
%>
<head>
<meta charset="UTF-8">
<title>出入库记录</title>
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport"
	content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<link rel="stylesheet" href="<%=request.getContextPath()%>/css/font.css">
<link rel="stylesheet"
	href="<%=request.getContextPath()%>/css/xadmin.css">
<script type="text/javascript"
	src="<%=request.getContextPath()%>/lib/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript"
	src="<%=request.getContextPath()%>/js/xadmin.js"></script>
</head>
<body>
	<div class="x-nav">
		<span class="layui-breadcrumb"> <a href="">库存管理</a> <a> <cite>出入库记录</cite></a>
		</span> <a class="layui-btn layui-btn-small"
			style="line-height: 1.6em; margin-top: 3px; float: right"
			onclick="location.reload()" title="刷新"> <i
			class="layui-icon layui-icon-refresh" style="line-height: 30px"></i>
		</a>
	</div>
	<div class="layui-fluid">
		<div class="layui-row layui-col-space15">
			<div class="layui-col-md12">
				<div class="layui-card">
					<div class="layui-card-body ">
						<form class="layui-form layui-col-space5">
							<div class="layui-input-inline layui-show-xs-block">
								<select class="type" name="type" lay-search>
									<option value="-1" selected>全部</option>
									<option value="0">仅显示出库记录</option>
									<option value="1">仅显示入库记录</option>
								</select>
							</div>
							<div class="layui-input-inline layui-show-xs-block">
								<select class="respository-id" name="respositoryId" lay-search>
									<option value="-1" selected>全部</option>
								</select>
							</div>
							<div class="layui-inline layui-show-xs-block">
								<input class="layui-input" autocomplete="off" placeholder="开始日"
									name="startTime" id="start">
							</div>
							<div class="layui-inline layui-show-xs-block">
								<input class="layui-input" autocomplete="off" placeholder="截止日"
									name="endTime" id="end">
							</div>
							<div class="layui-inline layui-show-xs-block">
								<button class="layui-btn" lay-submit="" lay-filter="sreach">
									<i class="layui-icon">&#xe615;</i>
								</button>
							</div>
						</form>
					</div>
					<div class="layui-card-body ">
						<table class="layui-table" lay-filter="layui_table_list" id="test"></table>
					</div>
				</div>
			</div>
		</div>
	</div>
</body>
<script>
	layui.use('laydate', function() {
		var laydate = layui.laydate;

		//执行一个laydate实例
		laydate.render({
			elem : '#start',
			type: 'datetime'
		});

		//执行一个laydate实例
		laydate.render({
			elem : '#end',
			type: 'datetime'
		});

	});
</script>
<script>
	layui.use([ 'table', 'layer', 'jquery', 'laypage', 'form' ], function() {
		var table = layui.table, layer = layui.layer, $=layui.$, laypage = layui.laypage, form = layui.form;
		
		var index = layer.msg('数据正从火星赶来...', {icon: 16, time: 100000, shade: 0});
		var param = {}
		
		// 初始化下拉框数据
		$.ajax({
			url: '<%=basePath%>/respository/queryRespositorysforSelect',
			dataType: 'json',
			type: 'GET',
			success: function(data) {
				$.each(data.data, function (index, item) {
					$('.respository-id').append(new Option(item.address, item.id));// 下拉菜单里添加元素
				});
				layui.form.render("select");
			}
		});
		
		//表初始化
       	table.render({
       		id : 'listReload',
       		elem : '#test',
       		toolbar : '#toolbarDemo',
       		cols : [[
       			{field:'id', title: '库存ID', hide:true},
       			{field:'goodId', title: '货物ID', hide:true},
       			{field:'goodName', title: '货物名称'},
       			{field:'goodSize', title: '货物规格'},
       			{field:'goodType', title: '货物类型'},
       			{field:'respositoryId', title: '仓库ID', hide:true},
       			{field:'respositoryName', title: '仓库地址'},
       			{field:'number', sort: true, title: '库存数量'},
       			{field:'createTime', sort: true, title: '记录日期'},
       			{field:'userName', title: '记录人'},
       			{field:'type', title: '记录类型'}
               ]],
       		method : 'POST',
       		url: '<%=basePath%>/record/listRecordInOut',
			contentType : 'application/json;charset=utf-8',
			page : true,
			loading: true, // 翻页加loading
			limits : [ 10, 15, 20, 50 ],
			request : {
				pageName : 'pageNumber',
				limitName : 'pageSize'
			},
			where : param,
			response : {
				statusName : 'errCode', //状态字段名称
				statusCode : '200', //状态字段成功值
				msgName : 'errMsg', //消息字段
				countName : 'count', //总数字段
				dataName : 'data' //数据字段
			},
			done: function(res, curr, count){
				$("[data-field='type']").children().each(function () {
                    if ($(this).text() == '1') {
                        $(this).text("入库");
                    } else if ($(this).text() == '0') {
                        $(this).text("出库");
                    } 
                });
				layer.close(index);
			}
		});
		
		form.render();
		
		// 条件查询
		form.on('submit(sreach)',function(data){
			console.log(data);
			var formData = data.field;
			var startTime = formData.startTime,	
				endTime = formData.endTime, 
				respositoryId = formData.respositoryId,
				type = formData.type;
			var par = {
		        	  startTime: startTime,
		        	  endTime: endTime,
		        	  respositoryId: respositoryId,
		        	  type: type
			        }
			table.reload('listReload', {
				page: {
					curr: 1
				},
				where: par
			});
			return false;
		});
	});
</script>
</body>
</html>